

var HeaderNavHeight = $("#HeaderNav").height()  //获取HeaderNav的高度
var FrameFooterHeight = $("#FrameFooter").height() //获取Footer的高度

var initFrameBodyWidth = $("#FrameBody").width()
var initFrameLeftWidth = $("#FrameLeft").width()
var body = document.querySelector('body');
// 设置 overflow-y 属性为 hidden
body.style.overflowX = 'hidden';

function initFrameHeightSize() {
    let h = $(window).height()
    $("#FrameLeft").css("height", h - HeaderNavHeight - FrameFooterHeight - 28)
    $("#FrameBody").css("height", h - HeaderNavHeight - FrameFooterHeight - 28)
    $("#liefBodyDrag").css("height", h - HeaderNavHeight - FrameFooterHeight - 28)
}
function initFrameBodyFrameWidthSize(initWidth) {

//当前可视化区域的宽度-FrameLeft的宽度
   var width= $(window).width();
    var FrameLeftWidth=$("#FrameLeft").width();
    var liefBodyDragWidth=$("#liefBodyDrag").width();
     var FrameBodyWidth=width-FrameLeftWidth-liefBodyDragWidth;
    $("#FrameBody").css("width",FrameBodyWidth-initWidth);
}




function liefBodyDrag() {
    $("#liefBodyDrag").mousedown(function (e) {
        //元素绑定鼠标松开事件,取消onmosemove事件
        $(this).mouseup(function () {
            $(document).unbind("mousemove");
        });
        var startFrameBodyWidth = $("#FrameBody").width()
        var startFrameLeftWidth = $("#FrameLeft").width()
        var offset = $(this).offset();
        var x = e.pageX - offset.left;
        var y = e.pageY - offset.top;
        $(document).bind("mousemove", function (ev) {
            //检测是否距离左侧边界<50px,或者右侧边界50px
            if (ev.pageX < 100 || ev.pageX > $(window).width()/2) {
                return;
            }

            $("#FrameLeft").css("width", ev.pageX - x);
            var newStartFrameLeftWidth = $("#FrameLeft").width()
            $("#FrameBody").css("width", startFrameBodyWidth + startFrameLeftWidth - newStartFrameLeftWidth);

        });
        //阻止默认事件
        e.preventDefault();

    });
}

//双击liefBodyDrag,恢复FrameLeft的宽度和FrameBody的宽度
function dblclick() {
    $("#liefBodyDrag").dblclick(function () {
        $("#FrameLeft").css("width", initFrameLeftWidth);
        $("#FrameBody").css("width", initFrameBodyWidth);
    })
}


(function ($, window) {


    //监听鼠标拖动,改变FrameLeft的宽度
    liefBodyDrag()
    //双击liefBodyDrag,恢复FrameLeft的宽度和FrameBody的宽度
    dblclick()


    //监听屏幕变化,改变FrameLeft和FrameBody的高度
    initFrameHeightSize()
    initFrameBodyFrameWidthSize(20);
    $(window).resize(function () {
        initFrameHeightSize()
        initFrameBodyFrameWidthSize(20);
    });

}(jQuery, window))